
var newer = newer || {};
newer.gd = newer.gd || {};

newer.PeopleCard = function(o) {
	this.domNode = o.domNode;
	
	this.idSuffix = (o.idSuffix!=undefined)?o.idSuffix:"";
	
	this.personInfo = o.personInfo;
	
	this.init();
};

newer.PeopleCard.prototype = {
	init: function() {
		this.domNode.html('<a href="/newer/p/'+this.personInfo.id+'/t/about"><div class="people-card-container" id="people-card-container-'+this.idSuffix+'"><div class="people-card-avatar" id="people-card-avatar-'+this.idSuffix+'"></div><div class="people-card-info" id="people-card-info-'+this.idSuffix+'"></div></div></a>');
		this.avatarNode = $("#people-card-avatar-"+this.idSuffix);
		this.infoNode = $("#people-card-info-"+this.idSuffix);
		this.containerNode = $("#people-card-container-"+this.idSuffix);
		
		this.domNode.on("click", $.proxy(function(event) {
			event.preventDefault();
			var toStatus = { ptype:newer.UriHelper.PEOPLE_TYPE, id:this.personInfo.id };
			var fromStatus = newer.gd.pstatus;
			newer.UriHelper.initRedirection({
				fromStatus:fromStatus,
				toStatus:toStatus
			});
			$(".nw-event-listener").trigger("nw-event", {
				type:newer.EventHelper.PAGE_TYPE, 
				fromStatus:fromStatus,
				toStatus:toStatus
			});
		}, this)).addClass("link-like-element");
		
		// bind mouse enter and leave effect
		this.containerBgColor = this.containerNode.css('background-color');
		this.containerBorderColor = this.containerNode.css('border-color');
		this.domNode.on("mouseenter", $.proxy(this.mouseEnter, this));
		this.domNode.on("mouseleave", $.proxy(this.mouseLeave, this));
		
		this.refresh();
	},
	
	refresh: function() {
		if(this.personInfo.hasPhoto) {
			this.avatarNode.html('<img style="width:50px;height:50px;" src="/Photos/displayUserPhoto?id='+this.personInfo.id+'&size=50&s='+Math.random()+'"/>');
		} else {
			this.avatarNode.html('<img style="width:50px;height:50px;" src="/public/images/default-user-image"/>');
		}
		this.infoNode.html('<div><strong>'+this.personInfo.name+'</strong></div><div>'+this.personInfo.company+'</div><div style="font-size:11px;">friends:'+this.personInfo.friendsNum+' circles:'+this.personInfo.circlesNum+'</div>');	
	},
	
	mouseEnter: function() {
		this.containerNode.css({"background-color":"#def","border-color":"#cdf"});
	},
	
	mouseLeave: function() {
		this.containerNode.css({"background-color":this.containerBgColor,"border-color":this.containerBorderColor});
	}
}